{extend name="$index_style_layout" /}

<!--SEO相关-->
{block name="head_title"}{$fid?($info['seo_title']?:$info['name']):$m_info['title']}{/block}
{block name="head_keword"}{$fid?($info['seo_keywords']?:$info['name']):$m_info['title']}{/block}
{block name="head_description"}{$info.seo_description}{/block}

{block name="body_ExtraHead"}
<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak={$webdb.baidu_map_key}"></script>
<script type="text/javascript" src="https://api.map.baidu.com/getscript?v=2.0&ak={$webdb.baidu_map_key}&services=&t=20191018173825"></script>
{/block}

{block name="body_AllScorllSlide"}
<!--通栏横幅图片__STATIC__/css/qb_ui.css中控制图片宽度百分百高度行内样式设置，如不设置不小于100px---->
<!--
<div class="qb_ui_AllscrollBanner" style="height:300px;">
	<a href="#1"><img src="__STATIC__/images/s0.jpg"></a>
</div>
-->
<div class="abanner banner">
    {qb:tag name="cms_list_common_banner" type="image"}

    {empty name="picurl"}
    <img src="__STATIC__/qy_dd/upload/2019/01/14/15474501321376wrws.jpg?v=v11" alt="" class="img">
    {else /}
    <div class="qb_ui_AllscrollBanner">
        <a href="{$url}"><img src="{$picurl}"></a>
    </div>
    {/empty}

    {/qb:tag}
    <div class="text_box w1280">
        <div class="en">TITLE</div>
        <div class="cn">{$info['name']}</div>
        <div class="down"></div>
    </div>
</div>
{/block}

{block name="body_content"}
{include file="content/left" /}
<div class="main join">
    <div class="box" style="padding-top: 0px;">
        <div class="box_cen w1280">
            <div class="title wow fadeInUp animated"con>
                <div class="cn_tit">{qb:tag name="single_contact_txt_1" type="text"}联系我们{/qb:tag}</div>
                <div class="en_tit">{qb:tag name="single_contact_txt_2" type="text"}Contact Us{/qb:tag}</div>
                <div class="line"></div>
            </div>
            {qb:tag name="single_contact_txt_3" type="text"}
            <div class="address_list wow fadeInUp large animated"con>
                <ul class="f-cb">
                    <li data-lng="27.9914848433" data-lag="116.3650379823" style="height: 405px; margin-bottom: 0px;">
                        <div class="pic">
                            <img src="__STATIC__/qy_dd/upload/2018/12/25/15457077744549miyzm.png" alt="" class="img">
                        </div>
                        <div class="name">总部</div>
                        <div class="msg">
                            <div class="tel">电话：{$webdb.service_tel}</div>
                            <div class="email">邮箱：{$webdb.service_email}</div>
                            <div class="address">地址：</div>
                        </div>
                    </li>
                </ul>

                <div class="map_box"></div>
            </div>

            <div class="address_list wow fadeInUp md">
                <ul class="f-cb">
                    <li data-lng="27.9914848433" data-lag="116.3650379823">
                        <div class="pic">
                            <img src="__STATIC__/qy_dd/upload/2018/12/25/15457077744549miyzm.png" alt=""  class="img">
                        </div>
                        <div class="name">总部</div>
                        <div class="msg">
                            <div class="tel">电话：{$webdb.service_tel}</div>
                            <div class="email">邮箱：{$webdb.service_email}</div>
                            <div class="address">地址：</div>
                        </div>
                    </li>
                </ul>
            </div>

            {/qb:tag}
        </div>
    </div>

</div>

{/block}

{block name="html_ExtraJsEnd"}
<script>

    $('.address_list ul li').click(function(){
        var _this=$(this);
        $(this).addClass('active').siblings().removeClass('active');
        $('.address_list ul li').css('margin-bottom',0);
        var top=$(this).offset().top+$(this).outerHeight(true)-$(this).parents('.address_list').offset().top+15;

        var lag=$(this).attr('data-lag');
        var lng=$(this).attr('data-lng');
        var tit=$(this).find('.name').text();
        var tel=$(this).find('.tel').text();
        var email=$(this).find('.email').text();
        var address=$(this).find('.address').text();
        var text="<div class='tit'>"+tit+"</div><p>"+tel+"</p><p>"+email+"</p><p>"+address+"</p>";
        var map_data='<div class="close"></div>\n' +
            '<div id="map"></div>\n';

        _this.parents('.address_list').find('.map_box').empty().append(map_data);
        _this.parents('.address_list').find('.map_box').css({
            'position':'absolute',
            'top':top
        });
        $('.address_list ul li').css('margin-bottom',0);
        _this.css('margin-bottom',_this.parents('.address_list').find('.map_box').height()+45);

        _this.parents('.address_list').find('.close').click(function(){
            $('.address_list ul li').removeClass('active');
            $('.address_list ul li').css('margin-bottom',0);
            $('.map_box').empty();
        })

        function initMap(a,b,c){
            createMap(a,b);//创建地图
            setMapEvent();//设置地图事件
            addMapControl();//向地图添加控件
            addMapOverlay(a,b,c);//向地图添加覆盖物
        }
        function createMap(a,b){
            map = new BMap.Map("map");
            map.centerAndZoom(new BMap.Point(a,b),18);
        }
        function setMapEvent(){
            map.enableScrollWheelZoom();
            map.enableKeyboard();
            map.enableDragging();
            map.enableDoubleClickZoom()
        }
        function addClickHandler(target,window){
            target.addEventListener("click",function(){
                target.openInfoWindow(window);
            });
        }
        function addMapOverlay(_a,_b,_c){
            var a=_a;
            var b=_b;
            var markers = [
                {content:"",title:"",imageOffset: {width:-46,height:-21},position:{lat:b,lng:a}}
            ];
            for(var index = 0; index < markers.length; index++ ){
                var point = new BMap.Point(markers[index].position.lng,markers[index].position.lat);
                var marker = new BMap.Marker(point,{icon:new BMap.Icon("http://api.map.baidu.com/lbsapi/createmap/images/icon.png",new BMap.Size(20,25),{
                        imageOffset: new BMap.Size(markers[index].imageOffset.width,markers[index].imageOffset.height)
                    })});
                var label = new BMap.Label(markers[index].title,{offset: new BMap.Size(25,5)});
                var opts = {
                    width: 200,
                    title: markers[index].title,
                    enableMessage: false
                };

                var infoWindow = new BMap.InfoWindow(_c);
                addClickHandler(marker,infoWindow);
                map.addOverlay(marker);
                map.openInfoWindow(infoWindow,point);
            };
        }

        //向地图添加控件
        function addMapControl(){
            var scaleControl = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});
            scaleControl.setUnit(BMAP_UNIT_IMPERIAL);
            // map.addControl(scaleControl);
            var navControl = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});
            // map.addControl(navControl);
            var overviewControl = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:true});
            // map.addControl(overviewControl);
        }
        var map;
        initMap(lag,lng,text);
    })

</script>
{/block}
{block name="body_Class"}header_no_fix f5f6fa{/block}